<template>
  <transition name="fade">  
    <div class="load-outer">
        <div class='load-wrap' v-show="modalVisible">
            <section class="spinner">
                <div class="spinner-container container1">
                    <div class="circle1"></div>
                    <div class="circle2"></div>
                    <div class="circle3"></div>
                    <div class="circle4"></div>
                </div>
                <div class="spinner-container container2">
                    <div class="circle1"></div>
                    <div class="circle2"></div>
                    <div class="circle3"></div>
                    <div class="circle4"></div>
                </div>
                <div class="spinner-container container3">
                    <div class="circle1"></div>
                    <div class="circle2"></div>
                    <div class="circle3"></div>
                    <div class="circle4"></div>
                </div>
            </section>
            <p class='txt'>{{loadText}}</p>
        </div>
    </div>
  </transition>  
</template>
<script>
export default {
    name:'spinLoading',
    props:{
         loadText:{
           type:String,
           default:'正在加载中...'
         }
    },
    data(){
        return {
            modalVisible:false,
        }
    }
}
</script>

